<template>
  <el-form>
    <el-form
      :model="dataPoolOrder"
      ref="queryForm"
      size="small"
      :inline="true"
      label-width="110px"
    >
      <el-form-item label="订单号" prop="orderNo">
        <el-input
          v-model="dataPoolOrder.orderNo"
          placeholder="请输入订单号"
          clearable
          style="width: 210px"
        />
      </el-form-item>
      <el-form-item label="活动" prop="activityId">
        <el-select
          v-model="dataPoolOrder.activityId"
          placeholder="请选择活动"
          clearable
          style="width: 210px"
        >
          <el-option label="活动1" :value="1"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="券码号" prop="redeemCode">
        <el-input
          v-model="dataPoolOrder.redeemCode"
          placeholder="请输入券码号"
          clearable
          style="width: 210px"
        />
      </el-form-item>
      <el-form-item label="订单状态" prop="orderStatus">
        <el-select
          v-model="dataPoolOrder.orderStatus"
          placeholder="请选择订单状态"
          clearable
          style="width: 210px"
        >
          <el-option label="已取消" :value="0"></el-option>
          <el-option label="待支付" :value="1"></el-option>
          <el-option label="已支付" :value="2"></el-option>
          <el-option label="已发货/待核销" :value="3"></el-option>
          <el-option label="确认收货/核销" :value="4"></el-option>
        </el-select>
      </el-form-item>
      <!-- <template v-if="isOrderSearch">
          <el-form-item label="订单状态" prop="orderStatus">
            <el-select
              v-model="dataPoolOrder.orderStatus"
              placeholder="请选择订单状态"
              clearable
              style="width: 210px"
            >
              <el-option label="已取消" :value="0"></el-option>
              <el-option label="待支付" :value="1"></el-option>
              <el-option label="已支付" :value="2"></el-option>
              <el-option label="已发货/待核销" :value="3"></el-option>
              <el-option label="确认收货/核销" :value="4"></el-option>
            </el-select>
          </el-form-item>
        </template>
        <el-form-item>
          <el-button
            :icon="isOrderSearch ? 'el-icon-arrow-up' : 'el-icon-more'"
            type="text"
            size="mini"
            @click="handleOrderMore"
            >{{ isOrderSearch ? "收起" : "更多" }}</el-button
          >
        </el-form-item> -->
    </el-form>

    <el-form
      :model="dataPoolUser"
      ref="queryForm"
      size="small"
      :inline="true"
      label-width="110px"
    >
      <el-form-item label="用户名" prop="userName">
        <el-input
          v-model="dataPoolUser.userName"
          placeholder="请输入用户名"
          clearable
          style="width: 210px"
        />
      </el-form-item>
      <el-form-item label="手机号" prop="userPhone">
        <el-input
          v-model="dataPoolUser.userPhone"
          placeholder="请输入手机号"
          clearable
          style="width: 210px"
        />
      </el-form-item>
      <el-form-item label="微信openId" prop="userWxOpenId">
        <el-input
          v-model="dataPoolUser.userWxOpenId"
          placeholder="请输入微信openId"
          clearable
          style="width: 210px"
        />
      </el-form-item>
      <el-form-item label="nhOpenId" prop="userNhOpenId">
        <el-input
          v-model="dataPoolUser.userNhOpenId"
          placeholder="请输入nhOpenId"
          clearable
          style="width: 210px"
        />
      </el-form-item>
      <template v-if="isUserSearch">
        <el-form-item label="用户标识类别" prop="userUniqueType">
          <el-select
            v-model="dataPoolUser.userUniqueType"
            placeholder="请选择用户标识类别"
            clearable
            style="width: 210px"
          >
            <el-option label="手机号" :value="1"></el-option>
            <el-option label="微信openId" :value="2"></el-option>
            <el-option label="掌银openId" :value="3"></el-option>
            <el-option label="手机号+wxOpenId" :value="4"></el-option>
            <el-option label="nh手机号+nhOpenId" :value="5"></el-option>
          </el-select>
        </el-form-item>
      </template>

      <el-form-item>
        <el-button
          :icon="isUserSearch ? 'el-icon-arrow-up' : 'el-icon-more'"
          type="text"
          size="mini"
          @click="isUserSearch = !isUserSearch"
          >{{ isUserSearch ? "收起" : "更多" }}</el-button
        >
      </el-form-item>
    </el-form>
    <el-form
      :model="dataPoolPrizeThird"
      ref="queryForm"
      size="small"
      :inline="true"
      label-width="110px"
    >
      <el-form-item label="权益实际领取手机号" prop="rightsInterestsGetPhone">
        <el-input
          v-model="dataPoolPrizeThird.rightsInterestsGetPhone"
          placeholder="请输入权益实际领取手机号"
          clearable
          style="width: 210px"
        />
      </el-form-item>
      <el-form-item label="券码号" prop="couponCode">
        <el-input
          v-model="dataPoolPrizeThird.couponCode"
          placeholder="请输入券码号"
          clearable
          style="width: 210px"
        />
      </el-form-item>
      <el-form-item label="卡券类型" prop="couponType">
        <el-select
          v-model="dataPoolPrizeThird.couponType"
          placeholder="请选择卡券类型"
          clearable
          style="width: 210px"
        >
          <el-option label="卡号卡密" :value="1"></el-option>
          <el-option label="三方接口" :value="2"></el-option>
          <el-option label="实物" :value="3"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="卡号" prop="thirdCardNumber">
        <el-input
          v-model="dataPoolPrizeThird.thirdCardNumber"
          placeholder="请输入卡号"
          clearable
          style="width: 210px"
        />
      </el-form-item>
      <template v-if="isPrizeSearch">
        <el-form-item label="卡密" prop="thirdCardPassword">
          <el-input
            v-model="dataPoolPrizeThird.thirdCardPassword"
            placeholder="请输入卡密"
            clearable
            style="width: 210px"
          />
        </el-form-item>
        <el-form-item label="收货人姓名" prop="consigneeName">
          <el-input
            v-model="dataPoolPrizeThird.consigneeName"
            placeholder="请输入收货人姓名"
            clearable
            style="width: 210px"
          />
        </el-form-item>
        <el-form-item label="收货人手机号" prop="consigneePhone">
          <el-input
            v-model="dataPoolPrizeThird.consigneePhone"
            placeholder="请输入收货人手机号"
            clearable
            style="width: 210px"
          />
        </el-form-item>
        <el-form-item label="物流单号" prop="logisticsNumber">
          <el-input
            v-model="dataPoolPrizeThird.logisticsNumber"
            placeholder="请输入物流单号"
            clearable
            style="width: 210px"
          />
        </el-form-item>
        <el-form-item label="权益唯一标识" prop="uniqueIdentify">
          <el-input
            v-model="dataPoolPrizeThird.uniqueIdentify"
            placeholder="请输入权益唯一标识"
            clearable
            style="width: 210px"
          />
        </el-form-item>
        <el-form-item label="核销状态" prop="cancelStatus">
          <el-select
            v-model="dataPoolPrizeThird.cancelStatus"
            placeholder="请选择核销状态"
            clearable
            style="width: 210px"
          >
            <el-option label="未核销" :value="0"></el-option>
            <el-option label="已核销" :value="1"></el-option>
          </el-select>
        </el-form-item>
      </template>
      <el-form-item>
        <el-button
          :icon="isPrizeSearch ? 'el-icon-arrow-up' : 'el-icon-more'"
          type="text"
          size="mini"
          @click="isPrizeSearch = !isPrizeSearch"
          >{{ isPrizeSearch ? "收起" : "更多" }}</el-button
        >
      </el-form-item>
    </el-form>
    <div>
      <el-form-item>
        <el-button
          type="primary"
          icon="el-icon-search"
          size="mini"
          @click="handleQuery"
          >搜索</el-button
        >

        <!-- <el-button icon="el-icon-refresh" size="mini" @click="resetQuery"
            >重置</el-button
          > -->
      </el-form-item>
    </div>
  </el-form>
</template>
<script>
export default {
  name: "OperationOptions",
  data() {
    return {
      // 显示搜索条件
      showSearch: true,
      dataPoolOrder: {},
      dataPoolUser: {},
      dataPoolPrizeThird: {},
      //是否展开订单搜索更多选项
      isOrderSearch: false,
      //是否展开用户搜索更多
      isUserSearch: false,
      //是否展开权益搜索更多
      isPrizeSearch: false,
    };
  },
  methods: {
    handleQuery() {
      const dataPoolDto = {
        dataPoolOrder: this.dataPoolOrder,
        dataPoolUser: this.dataPoolUser,
        dataPoolPrizeThird: this.dataPoolPrizeThird,
      };
      this.$emit("getSearchOptions", dataPoolDto);
    },
    handleOrderMore() {
      this.isOrderSearch = !this.isOrderSearch;
    },
  },
};
</script>
